<template>
  <div>
    <el-row>
      <el-col :span="8" >
        <h4 style="margin:0">
          <span>退款审核</span>
          
        </h4>
      </el-col>
      <el-col :span="16" style="text-align:right;position:relative" >
        <div style="position:absolute;right:0px;top:20px;z-index:2">
          <el-input placeholder="请输入电话号码" v-model="searchValue" class="input-with-select" style="width:250px">
                <el-button slot="append" @click="sheachFun" icon="el-icon-search"></el-button>
          </el-input>
        </div>
        <span v-show="checkleng.length>0 && userRole.DN_201002" style="position:absolute;right:10px;top:28px">
          <el-button class="addBtn" type="success" >未审核</el-button>
          <el-button class="addBtn" type="warning">已通过</el-button>
          <el-button class="addBtn" type="danger">不通过</el-button>
        </span>
      </el-col>
    </el-row>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="全部" name="first">
        <my-table v-if="navStatus == -1" :navStatus = 'navStatus'></my-table>
      </el-tab-pane>

      <el-tab-pane label="待审核" name="second">
        <my-table v-if="navStatus == 0" :navStatus = 'navStatus'></my-table>
      </el-tab-pane>

      <el-tab-pane label="审核通过" name="third">
        <my-table v-if="navStatus == 1" :navStatus = 'navStatus'></my-table>
      </el-tab-pane>

      <el-tab-pane label="审核不通过" name="fourth">
        <my-table v-if="navStatus == 2" :navStatus = 'navStatus'></my-table>
      </el-tab-pane>
    </el-tabs>
   
    
  </div>
</template>

<script>  
  import myTable from './childItem/myTable'
  import Http from '@/Http/Http'
  export default {
    data() {
      return {
        userRole:JSON.parse(sessionStorage.getItem('userSolt')),
        activeName: 'first',
        checkleng:'',
        tableData: [],
        navStatus:-1,
        searchValue:''
      }
    },
   
    components:{
      myTable
    },
    mounted() {
      var obj = document.getElementById('centerbox')
      obj.addEventListener('scroll', this.handleScroll,true)
    },
    destroyed(){
      
      var obj = document.getElementById('centerbox')
      obj.removeEventListener('scroll', this.handleScroll,true)
    },
    methods: {
      handleScroll() {
        var scollobj = document.getElementById('centerbox');
        var scrollTop = scollobj.scrollTop;
        const obj = document.getElementById('tab-first');
        const myobj = obj.parentNode.parentNode;
        if(scrollTop> 32){
          myobj.style.position = 'fixed';
          myobj.style.top = 0;
        } else {
          myobj.style.position = 'relative';
        }
      },
     
      handleClick(tab, event) {
        this.navStatus = Number(tab.index) -1;
      },
      
       //搜索
      sheachFun(val){
      },
    
      checkShowBtn(val) {
      }
    }
  }
</script>
<style>
.el-tabs__nav-wrap::after{
  width:0!important;
}
</style>
